<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <!-- IE 浏览器运行最新的渲染模式-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 启用响应式特性 -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 双核使用webkit内核 -->
    <meta name="renderer" content="webkit">
    <title>订单列表</title>
  <%
    String contextPath = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + contextPath + "/";
  %>
  <base href="<%=basePath%>">
    <link href="../../../css/flight/bootstrap.min.css" rel="stylesheet">
    <link href="../../../css/flight/common.css" rel="stylesheet">
    <link href="../../../css/flight/corptravel.css" rel="stylesheet">
    <link href="../../../css/flight/enterprise.css" rel="stylesheet">
    <!-- IconFont图标 -->
    <link href="../../../css/flight/iconfont.css" rel="stylesheet">
    <script type="text/javascript" src="../../../js/flight/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../../../js/flight/bootstrap.min.js"></script>
    <!-- 兼容IE8 -->
    <!--[if lte IE 9]>
    <script type="text/javascript" src="../../../js/flight/html5shiv.min.js"></script>
    <script type="text/javascript" src="../../../js/flight/respond.min.js"></script>
    <![endif]-->
    <!-- layer弹框 2.1 -->
    <script type="text/javascript" src="../../../js/flight/layer/layer.js"></script>

    <style>
        .tabs {
            width: 35px;
            padding: 3px;;
            background-color: #db514f;
            color: #fff;
            text-align: center;
            margin-top: 2px;
            margin-bottom: 2px;
            border-radius: 3px;
        }

        .startbox {
            overflow: hidden;
            margin-bottom: 5px;
        }

        .start {
            float: left;
            background-color: #f9a60a;
            padding: 2px;
            color: #fff;
            border-radius: 2px;
            margin-right: 5px;
        }

        .destination {
            float: left;
            background-color: #0096de;
            padding: 2px;
            color: #fff;
            border-radius: 2px;
            margin-right: 5px;
        }

        .startcity {
            float: left;
            font-size: 12px;
            color: #666;
        }

        .startcity span {
            font-size: 14px;
            color: #000;
            font-weight: bold;
        }

        .destination1 {
            float: left;
            background-color: #0096de;
            padding: 2px;
            color: #fff;
            border-radius: 2px;
            margin-right: 5px;
        }

        .destination2 {
            float: left;
            background-color: #0096de;
            padding: 2px;
            color: #fff;
            border-radius: 2px;
            margin-right: 5px;
        }
    </style>
</head>
<body class="bg-body">
<!-- header -->
<nav class="navbar navbar-default navbar-fixed-top bg-white">
    <!-- 小导航 -->
    <jsp:include page="../flight-header.jsp"></jsp:include>
    <!-- 小导航结束 -->

    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class=" " href="差旅报告/汇总.html"><img src="../../../images/logo.png" width="210" height="70" alt="系统LOGO"
                                                  class="pull-left mar-right-30" style="margin-left:-15px;"></a>

        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right">
                <li><a href="../oneWay.jsp"><i class="icon iconfont icon-nav-block font24">&#xe620;</i> 在线预订</a></li>
                <li class="active"><a href="Order-details.jsp"><i
                        class="icon iconfont icon-nav-block font24">&#xe61c;</i> 订单管理</a></li>

            </ul>
        </div><!-- /.navbar-collapse -->

    </div>
</nav>
<!-- header end -->
<!-- 管理模板 -->
<div class="container bg-gray-eee box-shadow mar-bottom-30"
     style="padding-right:0px; padding-left:0px; position:relative; margin-top:120px;">

    <!-- main -->
    <div class="rightCon" style="">
        <!-- 引导 -->
        <ol class="breadcrumb">
            <li>首页</li>
            <li>订单管理</li>
            <li class="active">订单列表</li>
        </ol>

        <table border="0" cellspacing="0" cellpadding="0"
               class="table table-hover table-striped font12 table-bordered v-align-top">
            <tr>
                <th>创建时间</th>
                <th>乘机人</th>
                <th>航班号</th>
                <th>舱位</th>
                <th>起飞行程</th>
                <th>到达行程</th>
                <th>结算总价</th>
                <th style="width:65px;">订单状态</th>
                <th>操作</th>
            </tr>
            <tr>
                <td>2016-01-14
                    <br>09:20
                </td>
                <td><p>荣思佳</p>
                    <p>李冬阳</p></td>
                <td>3U8825</td>
                <td>经济舱</td>
                <td>
                    <div class="startbox">

                        <div class="startcity"><span>三亚</span> 凤凰国际机场<br/>
                            2015-12-20&nbsp;&nbsp;11:45:00
                        </div>
                    </div>
                </td>
                <td>
                    <div class="startbox">

                        <div class="startcity"><span>哈尔滨</span> 太平国际机场<br/>
                            2015-12-20&nbsp;&nbsp;14:45:00
                        </div>
                    </div>
                </td>
                <td>1350.00</td>
                <td>新订单</td>
                <td><a href="Order-details.jsp">【查看详情】</a><br>
                    <a href="#" class="quxiao">【取消订单】</a><br>
                    <a href="../Book-online/Payment.jsp" target="_blank">【立即支付】</a></td>
            </tr>
            <tr>
                <td>2016-01-14 <br>
                    09:20
                </td>
                <td><p>荣思佳</p>
                    <p>李冬阳</p></td>
                <td>3U8825</td>
                <td>超值头等舱</td>
                <td>
                    <div class="startbox">

                        <div class="startcity"><span>三亚</span> 凤凰国际机场<br/>
                            2015-12-20&nbsp;&nbsp;11:45:00
                        </div>
                    </div>
                </td>
                <td>
                    <div class="startbox">

                        <div class="startcity"><span>哈尔滨</span> 太平国际机场<br/>
                            2015-12-20&nbsp;&nbsp;14:45:00
                        </div>
                    </div>
                </td>
                <td>1350.00</td>
                <td>已出票</td>
                <td><a href="Order-details.jsp">【查看详情】</a><br>

            </tr>
        </table>
        <nav class="pull-right ">
            <ul class="pagination pagination-sm" style=" margin-top:0px;">
                <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>
                <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
                <li><a href="#">2</a></li>
                <li><a href="#">...</a></li>
                <li><a href="#">5</a></li>
                <li><a href="#" aria-label="Next"> <span aria-hidden="true">&raquo;</span> </a></li>
            </ul>
            <div class="clearfix"></div>
        </nav>
        <div class="clearfix"></div>
    </div>
</div>
<!-- main end -->
</div>
<!-- 管理模板 结束 -->


<script>
    $(document).ready(function () {

        $(".quxiao").click(function () {  //取消订单
            layer.confirm('您确定要取消该订单？', {
                title: '取消订单',
                btn: ['确定', '取消'] //按钮
            }, function () {
                layer.msg('该订单已取消', {icon: 1});
            });
        });
    });
</script>
</body>
</html>
